<!DOCTYPE html>
<html>
<head>
<meta charset='ISO-8859-1'>
<title>Insert title here</title>
	<script src='../../lib/jquery/jquery-1.9.1.js'></script>
	<script src='../../lib/jquery-plugins/textcomplete/jquery.textcomplete.js'></script>
	<link type="text/css" rel="stylesheet" href='../../lib/bootstrap/css/bootstrap.css'/>
	<link type="text/css" rel="stylesheet" href='../../lib/jquery-plugins/textcomplete/jquery.textcomplete.css'/>
	<script type='text/javascript'>
	$(function(){
		var ac_entries = ['shortcut(a,b)', 'shortcut2', 'shortcut3', 'listview'];
		var cyw_function_names = ['shortcut', 'listview'];

		var strategies = [{
			match:    /(^|\s*)((sh|li)\w*)$/i,
			search:   function (term, callback) {
					callback(ac_entries.filter(function(value){
						return value.toLowerCase().indexOf(term.toLowerCase()) == 0 &&
							cyw_function_names.indexOf(term.toLowerCase()) == -1
					}));
				},
			  replace:  function(value){
				  var firstParenthesesIndex = value.indexOf('(');
				  if (firstParenthesesIndex != -1) {
				  	 return ['$1'+value.substring(0, firstParenthesesIndex+1), value.substring(firstParenthesesIndex+1)];					  
				  }else{
					  return '$1'+value;
				  }
			  }
		}]
		$('#textarea').textcomplete(strategies).focus();
	});
	</script>
</head>
<body>
<textarea rows='4' cols='100' id='textarea'></textarea>

</body>
</html>